{"ast":null,"code":"import React from\"react\";import{IconButton,TextField}from\"@mui/material\";import classNames from\"classnames\";import data from'@emoji-mart/data';import Picker from'@emoji-mart/react';import{UploadFiles,AudioMessage}from\"../../components\";import'./DialogInput.scss';import{jsx as _jsx}from\"react/jsx-runtime\";import{jsxs as _jsxs}from\"react/jsx-runtime\";import{Fragment as _Fragment}from\"react/jsx-runtime\";var DialogInput=function DialogInput(_ref){var _images$items;var toggleEmojiPicker=_ref.toggleEmojiPicker,emojiPickerVisible=_ref.emojiPickerVisible,setEmojiPickerVisible=_ref.setEmojiPickerVisible,value=_ref.value,textField=_ref.textField,setTextField=_ref.setTextField,maxSizeMessage=_ref.maxSizeMessage,uploadDocumentHandler=_ref.uploadDocumentHandler,handleSendMessage=_ref.handleSendMessage,pickerRef=_ref.pickerRef,addEmoji=_ref.addEmoji,flagForStyle=_ref.flagForStyle,textAreaRef=_ref.textAreaRef,images=_ref.images,voice=_ref.voice,callbackOnDeleteContent=_ref.callbackOnDeleteContent,onRecord=_ref.onRecord,onStopRecording=_ref.onStopRecording,isRecording=_ref.isRecording,isShortInput=_ref.isShortInput;return/*#__PURE__*/_jsxs(\"div\",{className:\"dialogInput\",children:[((_images$items=images.items)===null||_images$items===void 0?void 0:_images$items.length)>0&&!(voice!==null&&voice!==void 0&&voice.id)&&!isShortInput&&/*#__PURE__*/_jsx(\"div\",{className:\"dialogInput-upload\",style:!flagForStyle?{bottom:\"100px\"}:{bottom:\"117px\"},children:/*#__PURE__*/_jsx(UploadFiles,{uploaded:images,callbackOnDeleteContent:callbackOnDeleteContent})}),/*#__PURE__*/_jsxs(\"div\",{className:\"dialogInput-form\",style:isShortInput?{justifyContent:\"space-between\"}:{},children:[!isShortInput&&/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsxs(\"div\",{ref:pickerRef,className:\"dialogInput-emoji\",children:[/*#__PURE__*/_jsx(IconButton,{type:\"button\",className:\"dialogInput-form-smile\",onClick:function onClick(){return toggleEmojiPicker();}}),emojiPickerVisible&&/*#__PURE__*/_jsx(\"div\",{style:!flagForStyle?{bottom:\"90px\"}:{bottom:\"117px\"},className:\"dialogInput__emoji-picker\",children:/*#__PURE__*/_jsx(Picker,{onEmojiSelect:function onEmojiSelect(emojiData){addEmoji(emojiData.shortcodes);},set:\"apple\",theme:\"light\",locale:\"ru\",data:data})})]}),/*#__PURE__*/_jsx(TextField,{className:classNames(\"dialogInput-form-input\",{\"dialogInput-form-input--error\":textField.length>maxSizeMessage}),onChange:function onChange(e){return setTextField(e.target.value);},onKeyUp:function onKeyUp(e){if(e.key==='Enter'&&!e.shiftKey){handleSendMessage();setEmojiPickerVisible(false);}},value:textField,variant:\"outlined\",label:textField.length>0&&\"\".concat(textField.length,\"/\").concat(maxSizeMessage)||null,multiline:true,rows:flagForStyle?3:1,placeholder:\"\\u0412\\u0432\\u0435\\u0434\\u0438\\u0442\\u0435 \\u0441\\u043E\\u043E\\u0431\\u0449\\u0435\\u043D\\u0438\\u0435\",inputProps:{'aria-label':'Введите сообщение'},inputRef:textAreaRef}),/*#__PURE__*/_jsx(IconButton,{type:\"button\",className:\"dialogInput-form-image\",children:/*#__PURE__*/_jsx(\"input\",{type:\"file\",accept:\"image/*\",multiple:true,onChange:function onChange(e){return uploadDocumentHandler(e);}})})]}),isShortInput&&(voice===null||voice===void 0?void 0:voice.id)&&/*#__PURE__*/_jsxs(\"div\",{className:\"dialogInput-form-audio\",children:[/*#__PURE__*/_jsx(\"div\",{onClick:function onClick(){return(voice===null||voice===void 0?void 0:voice.id)&&callbackOnDeleteContent(voice.id);},className:\"dialogInput-form-audio__delete\"}),/*#__PURE__*/_jsx(AudioMessage,{isMe:true,content:voice})]}),value&&/*#__PURE__*/_jsx(IconButton,{type:\"button\",className:\"dialogInput-form-send\",onClick:handleSendMessage})||!isRecording&&(!isShortInput&&/*#__PURE__*/_jsx(IconButton,{type:\"button\",className:\"dialogInput-form-microphone\",onClick:onRecord})||/*#__PURE__*/_jsx(_Fragment,{}))||/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"span\",{className:\"dialogInput-form-info\",children:\"\\u0418\\u0434\\u0435\\u0442 \\u0437\\u0430\\u043F\\u0438\\u0441\\u044C\"}),/*#__PURE__*/_jsx(IconButton,{type:\"button\",className:\"dialogInput-form-stop\",onClick:onStopRecording})]})]})]});};export default DialogInput;","map":{"version":3,"names":["React","IconButton","TextField","classNames","data","Picker","UploadFiles","AudioMessage","DialogInput","toggleEmojiPicker","emojiPickerVisible","setEmojiPickerVisible","value","textField","setTextField","maxSizeMessage","uploadDocumentHandler","handleSendMessage","pickerRef","addEmoji","flagForStyle","textAreaRef","images","voice","callbackOnDeleteContent","onRecord","onStopRecording","isRecording","isShortInput","items","length","id","bottom","justifyContent","emojiData","shortcodes","e","target","key","shiftKey"],"sources":["/Users/poppie/Desktop/development/messenger/app/frontend/src/components/DialogInput/index.tsx"],"sourcesContent":["import React from \"react\";\nimport {IconButton, TextField} from \"@mui/material\";\nimport classNames from \"classnames\";\nimport data from '@emoji-mart/data'\nimport Picker from '@emoji-mart/react'\nimport {DialogInputProps} from \"../../models/props/DialogInputProps\";\nimport {UploadFiles, AudioMessage} from \"../../components\";\nimport './DialogInput.scss';\n\nconst DialogInput: React.FC<DialogInputProps> = (\n    {\n        toggleEmojiPicker,\n        emojiPickerVisible,\n        setEmojiPickerVisible,\n        value,\n        textField,\n        setTextField,\n        maxSizeMessage,\n        uploadDocumentHandler,\n        handleSendMessage,\n        pickerRef,\n        addEmoji,\n        flagForStyle,\n        textAreaRef,\n        images,\n        voice,\n        callbackOnDeleteContent,\n        onRecord,\n        onStopRecording,\n        isRecording,\n        isShortInput\n    }\n) => {\n    return (\n            <div className=\"dialogInput\">\n                {images.items?.length > 0 && !voice?.id && !isShortInput &&\n                    <div className=\"dialogInput-upload\"\n                         style={\n                             !flagForStyle?\n                                 {bottom: `100px`}:\n                                 {bottom: `117px`}\n                         }\n                    >\n                        <UploadFiles uploaded={images} callbackOnDeleteContent={callbackOnDeleteContent} />\n                    </div>\n                }\n                <div className=\"dialogInput-form\"\n                    style={isShortInput? {justifyContent: \"space-between\"}: {}}\n                >\n                    {!isShortInput && (\n                        <>\n                            <div ref={pickerRef} className=\"dialogInput-emoji\">\n                                <IconButton\n                                    type=\"button\"\n                                    className='dialogInput-form-smile'\n                                    onClick={() => toggleEmojiPicker()}\n                                />\n                                {emojiPickerVisible && (\n                                    <div\n                                        style={\n                                            !flagForStyle?\n                                                {bottom: `90px`}:\n                                                {bottom: `117px`}\n                                        }\n                                        className=\"dialogInput__emoji-picker\">\n                                        <Picker\n                                            onEmojiSelect={\n                                                (emojiData: {\n                                                    id: string;\n                                                    name: string;\n                                                    /** emoji */\n                                                    native: string;\n                                                    /** unicode */\n                                                    unified: string;\n                                                    keywords: string[];\n                                                    shortcodes: string;\n                                                }) => {\n                                                    addEmoji(emojiData.shortcodes);\n                                                }\n                                            }\n                                            set=\"apple\"\n                                            theme=\"light\"\n                                            locale=\"ru\"\n                                            data={data}\n                                        />\n                                    </div>\n                                )}\n                            </div>\n                            <TextField\n                                className={classNames(\"dialogInput-form-input\", {\n                                    \"dialogInput-form-input--error\": textField.length > maxSizeMessage\n                                })}\n                                onChange={e => (setTextField(e.target.value))}\n                                onKeyUp={e => {\n                                    if (e.key === 'Enter' && !e.shiftKey) {\n                                        handleSendMessage();\n                                        setEmojiPickerVisible(false);\n                                    }\n                                }}\n                                value={textField}\n                                variant=\"outlined\"\n                                label={((textField.length > 0 && `${textField.length}/${maxSizeMessage}`) || null)}\n                                multiline\n                                rows={flagForStyle? 3: 1}\n                                placeholder=\"Введите сообщение\"\n                                inputProps={{ 'aria-label': 'Введите сообщение' }}\n                                inputRef={textAreaRef}\n                            />\n                            <IconButton\n                                type=\"button\"\n                                className='dialogInput-form-image'\n                            >\n                                <input\n                                    type=\"file\"\n                                    accept=\"image/*\"\n                                    multiple={true}\n                                    onChange={e => uploadDocumentHandler(e)}\n                                />\n                            </IconButton>\n                        </>\n                    )}\n                    {isShortInput && voice?.id &&\n                        <div className=\"dialogInput-form-audio\">\n                            <div onClick={() => voice?.id! && callbackOnDeleteContent(voice.id)} className='dialogInput-form-audio__delete'/>\n                            <AudioMessage isMe={true} content={voice} />\n                        </div>\n                    }\n                    {\n                        (value &&\n                            <IconButton\n                                type=\"button\"\n                                className='dialogInput-form-send'\n                                onClick={handleSendMessage}\n                            />) ||\n                        (\n                            (!isRecording &&\n                                (\n                                    (!isShortInput &&\n                                        <IconButton\n                                            type=\"button\"\n                                            className='dialogInput-form-microphone'\n                                            onClick={onRecord}\n                                        />\n                                    ) || <></>\n                                )\n                            ) || (\n                                <>\n                                    <span className=\"dialogInput-form-info\">Идет запись</span>\n                                    <IconButton\n                                        type=\"button\"\n                                        className='dialogInput-form-stop'\n                                        onClick={onStopRecording}\n                                    />\n                                </>\n                            )\n                        )\n                    }\n                </div>\n            </div>\n    );\n}\n\nexport default DialogInput;"],"mappings":"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"},"metadata":{},"sourceType":"module"}